var app = new Vue({
	el: '#app',
	data() {
		return {
			form: {
				aaa: '1',
				bbb: '',
				ccc: '',
				ddd: '',
			},
			originData: CONFIG.tableData,
			pageNo: 1,
			tableData: [],
		}
	},
	computed: {
		
	},
	watch: {
		pageNo: {
			handler(val) {
				let list = this.originData.slice((val - 1) * 10, val * 10);
				this.getData(list);
			},
			immediate: true
		}
	},
	mounted() {
		
	},
	methods: {
		getData(list) {
			let res = [];
			let data = list;
			data.forEach(aItem => {
				aItem.children.forEach((bItem, bIndex) => {
					let obj = {...aItem, ...bItem}
					delete obj.children;
					if(bIndex == 0) {
						obj.rows = aItem.children.length;
					}
					res.push(obj);
				})
			})
			this.tableData = res;
		},
		arraySpanMethod({ row, column, rowIndex, columnIndex }) {
			if([0,1,2].includes(columnIndex)) {
				if(row.rows > 0) {
					return {
						rowspan: row.rows,
						colspan: 1
					}
				} else {
					return {
						rowspan: 0,
						colspan: 0
					}
				}
			}
		}
	}
})